<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	request.setCharacterEncoding("UTF-8");
	response.setContentType("text/html;charset=UTF-8");
%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
	String path = request.getContextPath();
%>
<html lang="zh-cn">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="renderer" content="webkit">
    <title></title>  
    <script src="<%=path %>/admin/js/jquery.js"></script>
    <script src="<%=path %>/admin/js/pintuer.js"></script>  
    <link rel="stylesheet" href="<%=path %>/static/css/paging.css" />
    <script src="<%=path %>/static/js/paging.js"></script>
    <style type="text/css" media="screen">
        * {
            padding: 0;
            margin: 0;
        }
        .promotion-name-wrap {
            padding: 50px 100px;
        }
        .promotion-table {
            width: 100%;
            text-align: center;
            margin-top: 10px;
            border-top: 1px solid #ccc;
            border-right: 1px solid #ccc;
        }
        .promotion-table tr td,.promotion-table tr th {
            padding:10px 30px;
            border-left: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
        }
        .pro-registered {
            margin: 100px 0 10px;
        }
        .detail-search input{
            width: 200px;
            height: 20px;
            border: 1px solid #ccc;
            padding: 2px;
        }
        .detail-search div {
            display: inline-block;
            width: 120px;
            height: 24px;
            text-align: center;
            margin: 0 0 0 30px;
            background: #eee;
            border-radius: 4px;
            border: 1px solid #ccc;
            cursor: pointer;
        }
    </style> 
</head>
<body>
<div class="promotion-name-wrap">
        <div>推广榜top10</div>
        <div>
         <input type="hidden" id="totalSize" name="totalSize" value="${count}">
			<input type="hidden" id="pageNo" name="pageNo" value="${pageNo}">
			<input type="hidden" id="pageSum" name="pageSum" value="${pageSum}">
            <table class="promotion-table" cellspacing="0">
                <thead>
                    <tr>
                        <th>推广排行</th>
                        <th>推广会员</th>
                        <th>推广注册总量</th>
                    </tr>
                </thead>
                <tbody>
                <c:forEach items="${countLists }" var="list" varStatus="vs">
                    <tr>
                        <td>${vs.count+pageInfo.startIndex}</td>
                        <td>${list.name }</td>
                        <td>${list.count}</td>
                    </tr>
                </c:forEach>
                </tbody>
            </table>
        </div>
        <div class="pro-registered">推广注册明细</div>
        <div class="detail-search">
            <input type="" name="" id="name" placeholder="关键词">
            <div onclick="changesearch()">搜索</div>
        </div>
        <div>
            <table class="promotion-table" cellspacing="0">
                <thead>
                    <tr class="thead">
                        <th>注册会员</th>
                        <th>推广会员</th>
                        <th>注册时间</th>
                    </tr>
                </thead>
                <tbody>
                <c:forEach items="${allList}" var="list" varStatus="vs">
                    <tr class="fir">
                        <td>${list.name }</td>
                        <td>${list.onname }</td>
                        <td><fmt:formatDate value="${list.createTime}" pattern="yyyy-MM-dd HH:mm:ss"/></td>
                    </tr>
                 </c:forEach>
                </tbody>
               <tr>
	            <td colspan="8">
	                <div id="page" class="page_div"></div>
	            </td>
	          </tr>
            </table>
        </div>
    </div>
</body>
<script type="text/javascript">
var paths = '<%=path %>';
var pageNo = Number($("#pageNo").val());
var totalSize = Number($("#totalSize").val());
var totalPage = Number($("#pageSum").val());
$(function(){
    page(pageNo,totalPage,totalSize);
})
function changesearch(){    
    newPage(1);
}
function page(pageNo,totalPage,totalSize){
        $("#page").paging({
            pageNo:pageNo,//当前页
            totalPage: totalPage,//总页数
            totalSize: totalSize,//总条数
            callback: function(num) {
                newPage(num); 
           }
        })
    }
function newPage(pageNo){
    var params = new Object();
    params.pageNo = pageNo;
    params.name=$("#name").val().trim();
    $.ajax({ 
        type:"post",
        url:"<%=path %>/bUserInfo/newPage2.html",
        data:params,
        dataType: "json",  
        timeout: 10000,  
        cache: false,  
        error: function(){
            alert("系统忙...");
        },
        success: function(data){
            var json=eval(data);
            pageNo = json.pageNo;
            pageSum = json.pageSum;
            count = json.count;
            var htmls = "";
         $.each(json.platfromList, function (index, item) {
               htmls+='<tr class="fir">'
                    +'<td>'+item.name+'</td>'
                    +'<td>'+item.onname+'</td>'
                    +'<td>'+getNowFormatDate(item.createTime)+'</td>'
                    +'</tr>'
         });
         $(".fir").remove();
         $(".thead").after(htmls);
         if(htmls==""){
             $("#page").html("");
         }else{
             $("#page").html("");
             $("#page").paging({
                 pageNo:pageNo,//当前页
                 totalPage: pageSum,//总页数
                 totalSize: count,//总条数
                 callback: function(num) {
                     newPage(num); 
                }
             }) 
          }
        }   
    });
} 
    

function getNowFormatDate(time) {
    var date = new Date(time);
    var seperator1 = "-";
    var seperator2 = ":";
    var year = date.getFullYear();
    var month = date.getMonth() + 1;
    var strDate = date.getDate();
    if (month >= 1 && month <= 9) {
        month = "0" + month;
    }
    if (strDate >= 0 && strDate <= 9) {
        strDate = "0" + strDate;
    }
    var h = 0;
    if (date.getHours() >= 0 && date.getHours() <= 9) {
        h = "0" + date.getHours();
    }else{
        h = date.getHours();
    }
    var m = 0;
    if (date.getMinutes() >= 0 && date.getMinutes() <= 9) {
        m = "0" + date.getMinutes();
    }else{
        m = date.getMinutes();
    }
    var s = 0;
    if (date.getSeconds() >= 0 && date.getSeconds() <= 9) {
        s = "0" + date.getSeconds();
    }else{
        s = date.getSeconds();
    }
    var currentdate = year + seperator1 + month + seperator1 + strDate
            + " " + h + seperator2 + m
            + seperator2 + s;
    return currentdate;
}
</script>
</html>